<!--
  用户主页
-->
<template>
  <div class="side" v-if="$store.state.login_status">
    <el-container>
        <el-aside width="200px">
          <el-row class="tac">
            <el-col class="side">
              <el-menu
                default-active="1"
                class="el-menu-vertical">
                <el-submenu index="1">
                  <span slot="title">
                    <i class="el-icon-menu"></i>
                    <el-link @click="myRecord" :underline=false>我的档案</el-link>
                  </span>
                  <el-menu-item-group>
                    <el-menu-item index="1-1" v-if=this.$store.state.record_status>
                      <i class="el-icon-document"></i>
                      <el-link @click="openRecord" :underline=false>查看档案</el-link>
                    </el-menu-item>
                    <el-menu-item index="1-2" v-if=this.$store.state.record_status>
                      <i class="el-icon-edit-outline"></i>
                      <el-link href="#/index/worker/record/recordApply" :underline=false>申请修改</el-link>
                    </el-menu-item>
                    <el-menu-item index="1-2" v-if=!this.$store.state.record_status>
                      <i class="el-icon-edit-outline"></i>
                      <el-link href="#/index/worker/record/createRecord" :underline=false>创建档案</el-link>
                    </el-menu-item>
                  </el-menu-item-group>
                </el-submenu>
                <el-menu-item index="2">
                  <i class="el-icon-search"></i>
                  <span slot="title">
                    <el-link href="#/index/worker/subsidy_Query" :underline=false>补助查询</el-link>
                  </span>
                </el-menu-item>
                <el-menu-item index="3">
                  <i class="el-icon-setting"></i>
                  <span slot="title">
                    <el-link href="#/index/worker/password_upt" :underline=false>修改密码</el-link>
                  </span>
                </el-menu-item>
                <el-menu-item index="3">
                  <i class="el-icon-download"></i>
                  <span slot="title">
                    <el-link href="#/index/worker/file_download" :underline=false>政策文件下载</el-link>
                  </span>
                </el-menu-item>
              </el-menu>
            </el-col>
          </el-row>
        </el-aside>
        <el-main>
<!--          <el-empty v-if=this.$store.state.record_status>-->
<!--            <el-link icon="el-icon-edit" type="primary" href="#/index/worker/record/createRecord">创建档案</el-link>-->
<!--          </el-empty>-->
          <router-view></router-view>
        </el-main>
    </el-container>
  </div>
</template>

<script>
import instance from "../../utils/request";

export default {
  name: "Index",
  methods:{
    //我的档案按钮单击事件绑定方法
    myRecord(){
      this.$router.push('/index/worker/record');
      this.$store.commit('changeMyRecord_StatusToTrue');
    },
    //档案详情按钮单击事件绑定方法
    openRecord(){
      this.$router.push('/index/worker/record/myRecord');
      this.$store.commit('changeMyRecord_StatusToFalse');
    }
  },
  //页面加载时获取档案情况
  created() {
    let _this = this;
    instance.post('/api/record/workerPortal').then(function (res) {
      if(res.data.code === 200){
        console.log(res.data);
        _this.$store.commit('changeRecord_Status');
      }
    }).catch(function (err) {
      console.log(err);
    });
  }
}
</script>

<style scoped>
.el-header, .el-footer {
  background-color: #B3C0D1;
  color: #333;
  text-align: center;
  line-height: 60px;
}
.side{
  /*margin: 0px;*/
  /*padding: 0px;*/
}
.el-aside {
  background-color: #D3DCE6;
  color: #333;
  text-align: center;
  line-height: 200px;
  height: 590px;
  margin: 0;
}

.el-main {
  background-color: #E9EEF3;
  color: #333;
  text-align: center;
  height: 580px;
  padding: 10px;
}

body > .el-container {
  margin-bottom: 0px;
}

.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
  line-height: 260px;
}

.el-container:nth-child(7) .el-aside {
  line-height: 320px;
}
.el-menu-vertical{
  height: 590px;
}
</style>
